<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" >
<head>
    <meta charset="UTF-8">
    <title>壹互联卡券管理系统</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <link rel="stylesheet" href="/css/wap/cardLogin.css">
</head>
<body>
<div class="loginInter">
    <img src="/img/wap/loginHeader.png" alt="" class="loginHeader">
    <form action="/wap/logins" method="post">
    <div class="formSub">
     <p class="user-p"><input type="text" class="user check" placeholder="请输入用户名" data-empty-msg="用户名不能为空" data-error-msg="用户名错误" name="username"></p>
     <p class="password-p"><input type="password" class="password check" placeholder="请输入用户密码" data-empty-msg="密码不能为空" data-error-msg="密码错误" name="password"></p>
	 <div style="color: red" th:text="${msg}"></div>
     <p class="submit-p"> <input type="submit" class="submit" value="登&nbsp;录"></p>
    </div>
    </form>
</div>
<script src="/js/wap/jquery.min.js"></script>
<script src="/js/wap/flexible.js"></script>
<script>
     $(function(){
        $(".check").on("blur",function(){
            var $this=$(this);
            var value=$this.val().trim();
            if(!value){
              console.log($this.attr("data-empty-msg"))
            }
        });
        $(".user").on("input",function(){
          var $this=$(this);
          console.log($this.val());
          console.log($(".password").val());
          if($this.val()&&$(".password").val()){
              $(".submit").css("background-color","rgb(248,73,86)")
          }else{
              $(".submit").css("background-color","rgb(254,129,137)")
          }
      });
        $(".password").on("input",function(){
            var $this=$(this);
            console.log($this.val());
            console.log($(".password").val());
            if($this.val()&&$(".user").val()){
                $(".submit").css("background-color","rgb(248,73,86)")
            }else {
                $(".submit").css("background-color","rgb(254,129,137)")
            }
        });

    }) 
</script>
</body>
</html>
